<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="${pageContext.request.contextPath}/statics/js/jquery-1.8.3.min.js"></script>
</head>
<body>
<form action="${pageContext.request.contextPath}/add" method="post">
<table border="1">
    <tr>
        <td colspan="2"><h2>添加疫苗接种预约信息</h2></td>
    </tr>

    <tr>
        <td>预约人姓名(*)</td>
        <td><input type="text" id="userName" name="userName"></td>
    </tr>

    <tr>
        <td>预约人身份证号(*)</td>
        <td><input type="text" id="cardId" name="cardId"> <p id="cId"></p></td>
    </tr>

    <tr>
        <td>预约接种日期(*)</td>
        <td><input type="text" id="bookingDate" name="bookingDate"></td>
    </tr>
    <tr>
        <td colspan="2"><input style="margin-left: 100px" type="submit"></td>
    </tr>
</table>
</form>
</body>
<script>
    $(function (){
        $("form").submit(function(){
            if ($("#userName").val()=="" || $("#cardId").val()=="" || $("#bookingDate").val()==""){
                alert("请填写完整的预约信息!")
                return false;
            }else if(!/^\d{4}-\d{2}-\d{2}$/.test($("#bookingDate ").val())){
                alert("日期格式不正确");
                return false;
            }
            var boo=true;
            $.ajax({
                url:"selectByCardIdServlet",
                type:"get",
                data:"cardId="+$("#cardId").val(),
                async:false,
                dataType:"text",
                success:function(data){
                    if (data=="true"){
                        $("#cId").html("该人员已接种或预约接种疫苗!");
                        boo=false;
                    }else{
                        $("#cId").html("");
                    }
                }
            })
            return boo;
        })
    })
</script>
</html>
